<!DOCTYPE html>
<html lang="en">

<head>
    {include file="common/meta" /}
</head>

<body>
    <div class="x-body">

        <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM元素 -->
        <!-- 按分类统计帖子 -->
        <div id="cate" style="width: 100%;height:700px;"></div>


    </div>
</body>

</html>
<script src="/assets/admin/js/echarts.min.js"></script>
<script>
    var rechargetime = []
    var rechargecount = []
    var catelist = `{$catelist}`
    //将json转为 JS 数组
    catelist = JSON.parse(catelist);

    // 对数据进行整理
    for(key in catelist){
        rechargetime.push(key)
        rechargecount.push(catelist[key])
    }

    //基于准备好的dom，初始化echarts实例
    var chartDom = echarts.init(document.getElementById('cate'));
    var option = {
        title: {
            text: '充值统计'
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: rechargetime
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        toolbox: {
            feature: {
                saveAsImage: {}
            }
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: rechargetime
        },
        yAxis: {
            type: 'value',
            minInterval:1
        },
        series: [
            {
                name: '今日充值人数',
                type: 'line',
                stack: 'Total',
                data: rechargecount
            }
        ]
    };
    chartDom.setOption(option);
</script>